import React from 'react';
import './index.less';

interface Props {
  children?: any;
  className?: string;
  title?: string;
  backgroundColor?: string;
  bgWidth?: string;
  showHeader?: boolean;
  panelStyle?: any;
  contentStyle?: any;
}
const IrrCase = (props: Props) => {
  const {
    className = '',
    title = '',
    backgroundColor = 'rgba(24, 24, 55, 0.1)',
    bgWidth = '2.45rem',
    children,
    showHeader = false,
    panelStyle = {},
    contentStyle = {},
  } = props;
  return (
    <>
      <div
        className={`irr_panel_wrap__containter ${className}`}
        style={panelStyle}
      >
        {showHeader && (
          <>
            <div className="panel-header__title" style={{ backgroundColor }}>
              {title}
            </div>
            <div className="panel-header-bg" style={{ width: bgWidth }}></div>
          </>
        )}
        <div
          className="panel-content"
          style={{ paddingTop: showHeader ? '0.35rem' : '0', ...contentStyle }}
        >
          {children}
        </div>
      </div>
    </>
  );
};

export default IrrCase;
